<!--
 * @Author: ChunLai
 * @Date: 2022-01-17 13:40:41
 * @LastEditTime: 2025-11-19 14:06:51
 * @Description: 保单信息 
 * @FilePath: \01.latest-short-insure\src\views\sign\components\infos\BillInfos.vue
-->
<template>
  <div class="customer_infos">
    <div class="notice-mode-head">
      <span class="head-box">保单相关信息</span>
    </div>
    <ul class="list_ul_box">
      <van-cell v-if="demoInfo.expayMode !== void 0" title="扣款方式：">
        {{ kkLabel(msgObj.expayMode) }}
      </van-cell>
      <template v-if="msgObj.expayMode == '2'">
        <van-cell
          v-if="demoInfo.bankAccName !== void 0"
          title="银行户名："
          :value="msgObj.bankAccName"
        />
        <van-cell
          v-if="demoInfo.bankName !== void 0"
          title="开户银行："
          :value="msgObj.bankName"
        />
        <van-cell v-if="demoInfo.bankAccNo !== void 0" title="银行卡号：">
          {{ countNum }}
        </van-cell>
        <van-cell
          v-if="demoInfo.firBankMobile !== void 0"
          title="银行预留手机号："
          :value="msgObj.firBankMobile"
        />
      </template>
    </ul>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  name: "BillInfos",
  data() {
    return {};
  },
  computed: {
    ...mapGetters({
      inputReg: "infoReg/inputReg",
      payInfo: "insert/payInfo",
      kkfsList: "dictionary/kkfsList",
      yesNoCheckList: "dictionary/yesNoCheckList",
    }),
    msgObj() {
      let res = {};
      res = this.payInfo;
      return res;
    },
    demoInfo() {
      let res = {};
      if (this.inputReg.payInfo) {
        res = this.inputReg.payInfo;
      }
      return res;
    },
    countNum() {
      return this.msgObj.bankAccNo.replace(/(\d{4})(?=\d)/g, "$1 ");
    },
    kkLabel() {
      return function (val) {
        let res = "";
        let obj = this.kkfsList.find((ele) => ele.keyId === val);
        if (obj && obj.text) {
          res = obj.text;
        }
        return res;
      };
    },
  },
  created() {},
  methods: {},
};
</script>

<style lang="less" scoped>
@import "./style.less";
</style>
